import Home from "@/pages/Home";
import ExpandingCards from "./pages/ExpandingCards";
import ProgressSteps from "./pages/ProgressSteps";
import RotatingNavigationAnimation from "./pages/RotatingNavigationAnimation";
import HiddenSearchWidget from "./pages/HiddenSearchWidget";
import BlurryLoading from "./pages/BlurryLoading";
import ScrollAnimation from "./pages/ScrollAnimation";
import SplitLandingPage from "./pages/SplitLandingPage";
import FormWave from "./pages/FormWave";
import MagicCard from "./pages/MagicCard";
import ThreeDCarousel from "./pages/ThreeDCarousel";

interface RouteType { 
  key: number;
  path: string;
  component: () => JSX.Element;
  title?: string;
}

const routes: RouteType[] = [
  {
    key: 1,
    path: "expandingcards",
    component: ExpandingCards,
    title: "ExpandingCards",
  },
  {
    key: 2,
    path: "progresssteps",
    component: ProgressSteps,
    title: "ProgressSteps",
  },
  {
    key: 3,
    path: "rotatingnavigationanimation",
    component: RotatingNavigationAnimation,
    title: "RotatingNavigationAnimation",
  },
  {
    key: 4,
    path: "hiddensearchwidget",
    component: HiddenSearchWidget,
    title: "HiddenSearchWidget",
  },
  {
    key: 5,
    path: "blurryloading",
    component: BlurryLoading,
    title: "BlurryLoading",
  },
  {
    key: 6,
    path: "scrollanimation",
    component: ScrollAnimation,
    title: "ScrollAnimation",
  },
  {
    key: 7,
    path: "splitlandingpage",
    component: SplitLandingPage,
    title: "SplitLandingPage",
  },
  {
    key: 8,
    path: "formwave",
    component: FormWave,
    title: "FormWave",
  },
  {
    key: 9,
    path: "magiccard",
    component: MagicCard,
    title: "MagicCard",
  },
  {
    key: 10,
    path: "threedcarousel",
    component: ThreeDCarousel,
    title: "ThreeDCarousel",
  },
  { key: 0, path: "*", component: Home },
];

export default routes;
